<template>
	<view>
		<an-nav-bar title="昵称"> </an-nav-bar>
		<view class="line">
			<input type="text" v-model="nickName" :placeholder="nickName ? nickName:'请输入昵称'">
		</view>
		<button @click="save">保存</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				nickName: "",
				show: 0
			};
		},
		onLoad(option) {
			if (option.show) {
				this.show = option.show
			}
		},
		onShow() {
			this.nickName = this.$mStore.state.userInfo.nickName
		},
		methods: {
			save() {
				if (!this.nickName) {
					this.$mHelper.toast('请输入昵称');
					return
				}
				this.$http.put('/app/customer/customer', {
					nickName: this.nickName
				}).then(res => {
					this.$mStore.commit('getUserInfo');
					this.$mHelper.toast('昵称修改成功');
					if (this.show == 1) {
						setTimeout(() => {
							this.$mHelper.back()
						}, 1000)
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background: #f8f8f8;
	}

	.line {
		height: 100rpx;
		background: #fff;
		padding: 0 30rpx;
		margin: 30rpx 0;

		input {
			width: 100%;
			height: 100rpx;
			font-size: 30rpx;
			line-height: 100rpx;
		}
	}

	button {
		width: 690rpx;
		height: 100rpx;
		line-height: 100rpx;
		background: linear-gradient(90deg, #d7b075, #aa8050);
		border-radius: 50rpx;
		text-align: center;
		font-size: 32rpx;
		color: #fff;
		margin: 60rpx auto;
	}
</style>
